﻿<ContentPage @ref="page">
    <ToolbarItems>
        <ToolbarItem Text="Help" OnClick="ShowHelp" />
    </ToolbarItems>

    <Background>
        <LinearGradientBrush EndPoint="new Point(0,1)">
            <GradientStop Color="Colors.LightSkyBlue" Offset="0" />
            <GradientStop Color="Colors.White" Offset="1" />
        </LinearGradientBrush>
    </Background>

    <ChildContent>
        <ShellProperties NavBarIsVisible="navBarVisible"
                         TabBarIsVisible="tabBarVisible"
                         TitleColor="titleColor" />

        <StackLayout>
            <StackLayout Orientation="StackOrientation.Horizontal">
                <Label Text="Enable NavBar: " />
                <CheckBox @bind-IsChecked="navBarVisible" />
            </StackLayout>
            <StackLayout Orientation="StackOrientation.Horizontal">
                <Label Text="Enable TabBar: " />
                <CheckBox @bind-IsChecked="tabBarVisible" />
            </StackLayout>
            <Button Text="Change Title Color" OnClick="ChangeTitleColor" />
        </StackLayout>
    </ChildContent>
</ContentPage>

@code {
    Microsoft.MobileBlazorBindings.Elements.Page page;

    bool navBarVisible = true;
    bool tabBarVisible = true;
    Color titleColor;

    List<Color> colors = new List<Color> {
    Colors.Red,
    Colors.Green,
    Colors.Blue
    };

    void ChangeTitleColor()
    {
        var index = (titleColor is not null ? colors.IndexOf(titleColor) + 1 : 0) % colors.Count;
        titleColor = colors[index];
    }

    async Task ShowHelp()
    {
        await page.NativeControl.DisplayAlert("Help", "Some help message", "OK");
    }
}